<!--  -->
<template>
  <div class="new-song">
    <div class="top">
      <span>新歌速递</span>
      <icon icon="#icon-right-circle" />
    </div>
    <song-list :data="newSongList" ></song-list>
  </div>
</template>

<script>
import Icon from "@/components/content/icon/Icon";
import SongList from "@/components/content/songList/SongList";

import { getHomeNewSong, newSongList } from "@/network/songList.js"

export default {
  name: "NewSongList",
  data() {
    return {
      newSongList: []
    }
  },
  components: {
    Icon,
    SongList,
  },
  mounted() {
    this.getHomeNewSong(7)
  },
  methods: {
    //获取新歌速递
    getHomeNewSong(type) {
      getHomeNewSong(type).then((res) => {
        for (let item in res.data) {
          this.newSongList.push(new newSongList(res.data[item]));
        }
        console.log(res.data[0]);
      });
    },
  }
};
</script>
<style lang='scss' scoped>
.new-song {
  margin: 10px;
  .top {
    display: flex;
    justify-content: space-between;
    font-size: $font-size-large;
    margin: 20px 0;
  }
}
</style>
